<template>
    <div class="add-project-wrapper">
        <Modal :title="modalTitle"
            v-model="dialogShow"
            @on-ok="save"
            @on-cancel="cancel"
            :auto-close="false"
            :mask-closable="false">
            <Form ref="form" :model="project" :grid="1" :label-width="90" label-position="right" :rules="projectRules">
                <Form-item label="名称" prop="projectName">
                    <Input placeholder="名称" clearable class="normal-input" v-model="project.projectName"></Input>
                </Form-item>
                <Form-item label="描述" prop="remark">
                    <Input placeholder="描述" type="textarea" clearable class="normal-input" v-model="project.remark"></Input>
                </Form-item>
                <Form-item label="权限" prop="access">
                    <RadioGroup v-model="project.access" type="button">
                        <Radio label="public">公共</Radio>
                        <Radio label="private">私有</Radio>
                    </RadioGroup>
                </Form-item>
            </Form>
        </Modal>
    </div>
</template>
<script>
import getData from 'getData'
import util from 'util'
export default {
    data () {
        return {
            project: {
                state: 1
            },
            modalShow: false,
            modalTitle: '新增项目',
            dialogShow: false,
            project: {
                projectName: '',
                remark: '',
                access: 'public'
            },
            btnLoading: false,
            projectRules: {
                projectName: [
                    {required: true, message: '请输入项目名称', trigger: 'blur'}
                ]
            }
        }
    },

    methods: {
        save() {
            let that =this; 
            that.$refs.form.validate((valid, fields) =>{
                if (valid) {
                    that.btnLoading = true;
                    getData.post('saveProject', that.project).then((res)=> {
                        that.btnLoading = false;
                        if (res.status == 200 && res.data.code == '000') {
                            that.$Message.success('保存成功！');
                            that.$emit('refresh');
                            that.cancel();
                        } 
                    });
                }
            });
        },
        cancel() {
            this.dialogShow = false;
        },
        show(project) {
            if (project) {
                this.project = util.util.cloneObj(project);
                this.modalTitle = '编辑项目';
            } else {
                this.project = {
                    state: 1
                };
                this.modalTitle = '新增项目';
            }
            this.dialogShow = true;
        }
    }
}
</script>
